
// 定义store数据

// 第一步: 通过redux 中的提供的一个方法 createStore

import { legacy_createStore as createStore } from 'redux';

// 第二步: 定义初始的state 数据
const defaultState = {
    count: 0,
    userinfo: {
        username: "朱总理",
        age: 88
    }
}

// 第三步: 定义reducer 纯函数, 用来修改state 数据
// 注意: reduce纯函数必须有一个返回值,返回值为修改完的state,用来更新定义的初始的state
function reducer(state = defaultState, action) {
    // actions为一个任务对象, 对象中应该有一个type属性,该属性是一个标识,标识如何修改state 数据,
    // 还有一个可选属性 payload 表示负载(参数),
    if (action.type == '+') {
        return {
            ...state, // 使用展开运算符 保留原state 数据, 避免数据的丢失
            count: state.count + action.payload
        }
    }
    if (action.type == 'edit') {
        return {
            ...state, // 使用展开运算符 保留原state 数据, 避免数据的丢失
            userinfo: {
                ...state.userinfo,
                username: action.payload
            }
        }
    }
    // 如果没有符合的action则返回原state 对象
    return state
}

// 第四步: 创建store 对象,使用createStore方法
// 传递reducer 方法, 使当前的仓库中有state 数据
const store = createStore(
    reducer,
    // 安装 完 chrome 插件 redux devtools 不能直接使用,因为看不到数据,需要在该处设置如下代码才可以,
    // 仅仅为了浏览器调试使用的
    window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()
)

// 第五步: 导出store
export default store
